<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport"
          content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, initial-scale=1.0, user-scalable=no">
    <meta name="format-detection" content="telephone=no, email=no">
    <meta name="HandheldFriendly" content="true">
    <title>确定设备进去配网模式</title>
    <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
    <script src="https://res2.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
    <link rel="stylesheet" href="__STATIC__/frozenui-2.0.0/release/css/frozenui.css"/>
    <link rel="stylesheet" href="__STATIC__/frozenui-2.0.0/release/demo/css/style.css">

</head>
<body ontouchstart>
<section class="ui-container">
    <section id="layout">
        <div class="demo-item">
            <div class="demo-block">
                <div class="ui-flex ui-flex-pack-center">
                    <div>
                        <img id="img" width="100%">
                    </div>
                </div>
                <div class="demo-block">
                    <div class="ui-whitespace">
                        <p id="des" class="ui-txt-justify" style="font-size: larger ;  margin-top: 60px "> &nbsp;&nbsp;&nbsp;&nbsp;</p>
                    </div>
                </div>
                <div class="ui-btn-wrap ui-btn-wrap-middle" style="margin-top: 180px" id="btnStart">
                    <button class="ui-btn-lg-nowhole ui-btn-primary">
                        开始配网
                    </button>
                </div>

                <div id="load" class="demo-block">
                    <div class="ui-loading-block show">
                        <div class="ui-loading-cnt">
                            <i class="ui-loading-bright"></i>
                            <p>正在加载中...</p>
                        </div>
                    </div>
                </div>

            </div>
        </div>
    </section>

</section>

</body>
<script>

    // 对浏览器的UserAgent进行正则匹配，不含有微信独有标识的则为其他浏览器
    var useragent = navigator.userAgent;
    if (useragent.match(/WindowsWechat/) == 'WindowsWechat' || useragent.match(/MicroMessenger/i) != 'MicroMessenger') {
        // 这里警告框会阻塞当前页面继续加载
        //alert('已禁止本次访问：您必须使用微信内置浏览器访问本页面！');
        document.head.innerHTML = '<title>抱歉，出错了</title><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=0"><link rel="stylesheet" type="text/css" href="https://res.wx.qq.com/open/libs/weui/0.4.1/weui.css">';
        document.body.innerHTML = '<div class="weui_msg"><div class="weui_icon_area"><i class="weui_icon_info weui_icon_msg"></i></div><div class="weui_text_area"><h4 class="weui_msg_title">请在微信客户端打开链接</h4></div></div>';
    }

    var chartData = {$deviceInfo};
    var p = document.getElementById('des');
    //显示设备进行配网状态设置的提示
    p.innerHTML = p.innerText + chartData.message
    //图片
    var img = document.getElementById('img');
    img.src = chartData.icon


    $("#btnStart").click(function () {
        wx.invoke('configWXDeviceWiFi', {}, function (res) {
            var err_msg = res.err_msg;
            if (err_msg === 'configWXDeviceWiFi:ok') {

                //关闭这个窗口，返回微信公众号主页
                wx.closeWindow();

                //配置成功,获取本地广播
                // wx.invoke('openWXDeviceLib', {'connType': 'lan'}, function (res) {
                //     // alert(res.err_msg);
                // });
                // wx.invoke('startScanWXDevice', {'connType': 'lan'}, function (res) {
                //     console.log('startScanWXDevice', res);
                //     alert(JSON.stringify(res));
                // });
                // wx.on('onScanWXDeviceResult', function (res) {
                //     alert("扫描到1个设备" + JSON.stringify(res));
                //     //自己解析一下res，里面会有deviceid,扫描设备的目的就是为了得到这个
                //     //然后就可以开始绑定了
                // });
            } else if (err_msg === 'configWXDeviceWiFi:cancle') {
                //配置失败
                alert('配置失败!' + err_msg);
            }
        });
    });

    wx.config(chartData.wechat)
    // echo 'start config';
    wx.ready(function () {

        //隐藏右上角的复制链接、分享链接到qq浏览器等! https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141115
        //要隐藏的菜单项，只能隐藏“传播类”和“保护类”按钮，所有menu项见附录3
        wx.hideMenuItems({
            menuList: [
                "menuItem:editTag",
                "menuItem:delete",
                "menuItem:copyUrl",
                "menuItem:originPage",
                "menuItem:readMode",
                "menuItem:openWithQQBrowser",
                "menuItem:openWithSafari",
                "menuItem:share:email",
                "menuItem:share:brand",
            ]
        });

        // 在这里调用 API
        wx.checkJsApi({
            jsApiList: ['configWXDeviceWiFi'],
            //成功初始化之后，隐藏加载
            success: function (res) {
                $("#load").hide();
            },
        });
    });
    wx.error(function (res) {
        $("#load").hide();
         lert('初始化化失败，log日志：' + JSON.stringify(res));
    });


</script>
</html>
